{% extends "smErp/base.html" %}

{% block css_style %}
    {% load staticfiles %}
    <link href="{% static 'smErp/css/brand_info.css' %}" type="text/css" rel="stylesheet">
    <style>
        .product_banner{
            height: 300px;
            position: relative;
            overflow: hidden;
            /* background: transparent url(/open/zh_CN/htmledition/res/img/bg/banner_bg371305.png) no-repeat center top; */
            /* background-size: auto auto; */
            /* background-size: auto auto; */
            background-size: cover;
            -webkit-background-size: cover;
        }
        .product_logo{
            width: 100px;
            height: 100px;
        }
        .product_info_box{
            min-height: 200px !important;
        }
    </style>
{% endblock %}



{% block content %}
    {% load staticfiles %}
    <div class="inner wrp">
        <div class="page_nav">
            <a href="{% url 'smErp:manage' %}" class="jsUrlLink" data-url="{% url 'smErp:manage' %}" target="_self">管理中心</a>
            <span class="gap">/</span>
            产品详情
        </div>

        {# 品牌头 #}
        <div class="brand_box">
            <div id="logo">
                <img src="{{ brand.logo }}">
            </div>
            <label id="brand_name">{{ brand.name_zh }}</label>
            <a href="javascript:void(0);" data-url="{% url "smErp:product_info" product.id %}" class="btn js_create jsUrlLink btn_primary" target="_self" onclick="delete_product(this)">
                <span>删除</span>
            </a>
        </div>

        <!-- 产品图片轮播  -->
        <div class="product_banner">
            <div class="flicker-example" data-block-text="false">
                <ul>
                    {% for img in product.smerpproductimg_set.all %}
                    <li data-background="{{ img.img }}">
                    </li>
                    {% endfor %}
{#                    <li data-background="{% static 'smErp/images/banner2.jpg' %}">#}
{#                    </li>#}
{#                    <li data-background="{% static 'smErp/images/banner3.jpg' %}">#}
{#                    </li>#}
                </ul>
            </div>
        </div>

        {# 品牌信息  #}
        <div class="container_box cell_layout product_info_box">
            <div class="brand-title" id="brand_title">
                <h1>基本信息</h1>
                <a href="{% url "smErp:product_change" product.id %}" data-url="{% url "smErp:product_change" product.id %}" class="btn js_create jsUrlLink btn_primary" target="_self">
                    <span>修改</span>
                </a>
            </div>
            <div class="main_bd">
                <div class="meta_content info_box">
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">产品名称</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.name }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">产品类型</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.get_type_display }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">功能定位</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.function }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">适用人群</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.suitable }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">不适用人群</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.not_suitable }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">注意事项</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.attention }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">客服热线</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.hotline }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">客服信息</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.service_info }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">生产流程展示</label>
                        <div class="frm_controls frm_vm_pt">
{#                            <a style="color: #4aaf33;" href="{{ product.workflows }}" target="_blank">查看</a>#}
                            <img class="thumbnail_image_M" src="{{ product.workflows }}" onclick="showBoxImage(this)"/>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">生产执行标准</label>
                        <div class="frm_controls frm_vm_pt">
                            <span class="frm_input_box" name="name">{{ product.standard }}</span>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">生成执行标准</label>
                        <div class="frm_controls frm_vm_pt">
{#                            <a style="color: #4aaf33;" href="{{ product.standard_pic }}" target="_blank">查看</a>#}
{#                            <img src="{{ product.standard_pic }}">#}
{#                            <span class="frm_input_box" name="name">{{ product.standard_pic }}</span>#}
                            <img class="thumbnail_image_M" src="{{ product.standard_pic }}" onclick="showBoxImage(this)"/>
                        </div>
                    </div>
                    <div class="frm_control_group show_value">
                        <label for="" class="frm_label">原材料</label>
                        <div class="frm_controls frm_vm_pt">
                            {% for m in product.smerpproductmaterial_set.all %}
                            <span class="frm_input_box" name="name">{{ m.material.name }}</span><br>
                            {% endfor %}

                        </div>
                    </div>
                </div>
            </div>
        </div>

        {# 证书列表 #}
        <div class="container_box cell_layout product_info_box">
            <div class="brand-title" id="brand_title">
                <h1>产品证书</h1>
                <a href="{% url "smErp:product_license" product.id%}?action=create" data-url="{% url "smErp:product_license" product.id%}" class="btn js_create jsUrlLink btn_primary" target="_self">
                    <span>添加</span>
                </a>
            </div>
                <div class="table_wrp app_list">
                    <table class="table js_draft" id="draft_tb" cellspacing="0">
                        <thead class="thead">
                            <tr>
                                <th class="table_cell content">证书名称</th>
                                <th class="table_cell content">证书图片</th>
                                <th class="table_cell opr">操作</th>
                            </tr>
                        </thead>
                        <tbody class="tbody" id="draftlists">
{#                {% for license in brand.smerpbrandlicense_set.all %}#}
{#                    {{ license.name }}#}
{#                {% endfor %}#}
                        {% if product.smerpproductlicense_set.all %}
                            {% for license in product.smerpproductlicense_set.all %}
                                <tr id="p_license_{{ license.id }}" style="border-bottom: 1px solid #e6e7ec;">
                                            <td colspan="1">
                                                <p class="table_cell content">{{ license.name }}</p>
                                            </td>
                                            <td colspan="1">
{#                                                <p class="table_cell opr"><a href="{{ license.img }}" target="_blank">查看</a></p>#}
                                                <p class="table_cell content"><img class="thumbnail_image" src="{{ license.img }}" onclick="showBoxImage(this)"></p>
                                            </td>
                                            <td colspan="1">
                                                <p class="table_cell opr"><a href="{% url "smErp:product_license" product.id %}?action=change&license={{ license.id }}">修改</a><a href="javascript:void(0);" data-license="{{ license.id }}" onclick="delete_product_license(this)">删除</a></p>
                                            </td>
                                        </tr>
                            {% endfor %}
                        {% else %}
                                <tr>
                                    <td colspan="4">
                                        <p class="empty_tips">暂无数据</p>
                                    </td>
                                </tr>
                        {% endif %}
                        <tr>
                            <td colspan="4">
                                <p class="empty_tips"></p>
                            </td>
                        </tr>
                        </tbody>
                    </table>
            </div>

        </div>
    </div>

{% endblock %}

{% block footscript %}
    <script>
        $('.flicker-example').flicker();

        function getCookie(c_name)
        {
            if (document.cookie.length>0)
            {
                c_start=document.cookie.indexOf(c_name + "=");
                if (c_start!=-1)
                {
                    c_start=c_start + c_name.length+1;
                    c_end=document.cookie.indexOf(";",c_start);
                    if (c_end==-1) c_end=document.cookie.length;
                    return unescape(document.cookie.substring(c_start,c_end))
                }
            }
            return ""
        }
        // 弹窗显示图片
        function showBoxImage(obj) {
            var url = $(obj).attr('src');
            //iframe层-父子操作
            layer.open({
                type: 2,
                area: ['800px', '500px'],
                title: '图片：',
                fixed: true, //不固定
                maxmin: true,
                content: url
            });
        };

        $("#email").blur(function(){
{#           alert("hello world");#}
            var email = $("#email").val();
{#            alert(email);#}
            if(!email){
{#                alert("hellow");#}
                $("#email-msg").css("color","red");
                $("#email-msg").html("请输入邮箱地址");
                $("#email-msg").show();
            }
        });

{#        $.ajaxSetup({#}
{#            beforeSend:function (xhr,settings) {#}
{#                xhr.setRequestHeader("X-CSRFtoken",$.cookie("csrftoken"))#}
{#            }#}
{#        });#}
        // 删除品牌
        function delete_product(obj){
            var url = $(obj).data("url");
            layer.confirm('确定要删除此产品？', {
                btn: ['确定','取消'] //按钮
            }, function(){
                $.ajax({
                    url: url,
                    type:"POST",
                    data:{"action": "delete"},
                    headers:{ "X-CSRFtoken":getCookie("csrftoken")},
                    success:function (data) {
                        console.log(data);
                        if(data.result == 0){
                            // 将表格此项删除
                            layer.msg("删除成功");
                            // 跳转到管理页面
                            window.location.href = "{% url 'smErp:manage' %}";
                        }else{
                            layer.msg(data.reason);
                        }
                }
            });
            }, function(){
                layer.msg('取消删除');
            });
        }

        function delete_product_license(obj){
{#            debugger#}
            var license_id =  $(obj).data("license");
            layer.confirm('确定删除此品牌证书？', {
                btn: ['确定','取消'] //按钮
            }, function(){
                $.ajax({
                    url:"{% url "smErp:product_license" product.id %}",
                    type:"POST",
                    data:{"license": license_id, "action": "delete"},
                    headers:{ "X-CSRFtoken":getCookie("csrftoken")},
                    success:function (data) {
                        console.log(data);
                        if(data.result == 0){
                            // 将表格此项删除
                            $("#p_license_" + license_id).remove();
                            layer.msg("删除成功");
                        }else{
                            layer.msg(data.reason);
                        }
                }
            });
            }, function(){
                layer.msg('取消删除');
            });
        }
    </script>
{% endblock %}




